"use client";
/*
* @Author: hongbin
* @Date: 2025-04-29 19:25:40
 * @LastEditors: hongbin
 * @LastEditTime: 2025-04-29 19:26:42
* @Description:
*/
import { FC } from "react";
import { FlexDiv } from "@/styled";
import styled from "styled-components";
import Image from "next/image";

interface IProps {}

const Header: FC<IProps> = () => {
    return (
        <SFlexDiv dir='column'>
            <SImage
                src='/bg2.png'
                alt='bg'
                width={2550}
                height={80}
                // fill
            />
            <SImage
                src='/bg_t.png'
                alt='bg'
                width={2560}
                height={139}
                // fill
            />
            <Title>xx-2025xxxxxx-xxxxxxxxx</Title>
        </SFlexDiv>
    );
};

export default Header;


const SImage = styled(Image)`
    /* opacity: 0.3; */
    width: 100%;
`;

const Title = styled.p`
    position: absolute;
    color: #fff;
    font-weight: bold;
    line-height: 50px;
    left: 50%;
    font-size: 2vw;
    transform: translate(-50%, 0);
`;

const SFlexDiv = styled(FlexDiv)`
    width: 100%;
    height: 80px;
    position: relative;

    & :nth-child(2) {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
    }
`;
